<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport"
          content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
    <!--引入第三方类库 css样式-->
    <link rel="stylesheet" href="./lib/bootstrap/css/bootstrap.min.css">
    <!--引入样式重置 base.less样式-->
    <link rel="stylesheet/less" href="./css/base.less">
    <!--引入自己的 index.less样式-->
    <link rel="stylesheet/less" href="./css/index.less">
    <link rel="stylesheet/less" href="./css/indexSearch.less">
    <link rel="stylesheet/less" href="./css/indexShopList.less">
    <!--引入第三方类库 less.js文件-->
    <script src="./lib/less/less.min.js"></script>
</head>
<body>
<!--头部区域 start-->
<header>
    <div class="mm_logo">
        <a href="index.html" title="慢慢买比价网-手机版">
            <img src="images/header_logo.png" alt="慢慢买比价网-手机版">
        </a>
    </div>
    <div class="mm_load">
        <a href="http://localhost:63342/code/lib/bootstrap/css/bootstrap.min.css.map?_ijt=tu1i8sg163kt7utuus35pa9tvs" title="手机APP下载">
            <img src="images/header_app.png" alt="手机APP下载">
        </a>
    </div>
</header>
<!--头部区域 end-->

<!--搜索区域 start-->
<nav class='clearfix'>
    <input class="fl" type="text" placeholder='请输入你想比价的商品'><input class='fr' type="button" value='搜索'>
</nav>
<!--搜索区域 end-->

<!--商品排列导航 start-->

    <ul class='shopCol'>
        <li><a href="#" style='color: red;'>综合</a></li>
        <li><a href="#">销量</a></li>
        <li><a href="#">价格<i class='caret'></i></a></li>
        <li class='fourth'><a href="#"><i class='glyphicon glyphicon-filter'></i>筛选</a></li>
    </ul>
<!--商品排列导航 end-->
<div class="product">

    <!--<div class="media" style='margin-top: 0px;'>
        <a class="media-left media-middle" href="#">
            <img src="./images/shopList.jpg" >
        </a>
        <div class="media-body">
            <p> 海信(Hisense) LED55EC520UA  55英寸 超高清4K 智能网络LED液晶电视</p>
            <h5 class="media-heading"><em style="font-size: 12px">￥</em>3299</h5>
            <div class="other">
                <h6 class="media-heading fl"><span>6</span>商城报价</h6>
                <h6 class="media-heading fr">有<i>4366</i>人评论</h6>
            </div>
        </div>
    </div>
    -->

    <!-- 商品列表 -->
    <script type='text/template'  id='tpl22'>
        {{each result as value i}}
        <div class="media" style='margin-top: 0px;'>
            <a class="media-left media-middle" href="bijia.html?data-getproductid={{value.productId}}&data-categoryId={{value.categoryId}}">
                {{#value.productImg}}
            </a>
            <div class="media-body">
                <a href="bijia.html?data-getproductid={{value.productId}}&data-categoryId={{value.categoryId}}" >
                    <p>{{value.productName}}</p>
                </a>
                <h5 class="media-heading">{{value.productPrice}}</h5>
                <div class="other">
                    <h6 class="media-heading fl"><span> {{value.productQuote.replace(/[^0-9]/g,'')}}</span>商城报价</h6>
                    <h6 class="media-heading fr">有<i>{{value.productCom.replace(/[^0-9]/g,'')}}</i>人评论</h6>
                </div>
            </div>
        </div>
        {{/each}}
    </script>

    <!--底部切换区域 start-->
    <div class="qieHuan">
        <nav>
            <ul class="pager">
                <li class="previous "><a href="javascript:;" class="m_l15">上一页</a></li>
                <li class="next"><a href="javascript:;" class="m_r15">下一页</a></li>
            </ul>
        </nav>
        <div class="btn-group">
            <button class="btn btn-default btn-lg dropdown-toggle" type="button" data-toggle="dropdown">
                 <span class="caret fr"></span>
            </button>
            <ul class="dropdown-menu" role="menu">
                <li><a href="#">1/7</a></li>
                <li><a href="#">2/7</a></li>
                <li><a href="#">3/7</a></li>
                <li><a href="#">4/7</a></li>
                <li><a href="#">5/7</a></li>
                <li><a href="#">6/7</a></li>
                <li><a href="#">7/7</a></li>
            </ul>
        </div>

    </div>
    <!--底部切换区域 end-->
</div>
<!--遮罩部分 start-->
<div class="mask"></div>
<!--遮罩部分 end-->





    <!--侧边菜单显示隐藏部分  start-->
    <div class="shaiXuan">
        <div class="head">
            筛选<i class='iconfont'>×</i>
        </div>
        <div class="body clearfix">
            <div class='head'>
                <a href="#">品牌</a>
                <a href="#">全部品牌</a>
            </div>
            <ul>
                <li><a href="#" class='on'>全部品牌</a></li>
                <li><a href="#">三星</a></li>
                <li><a href="#">创维</a></li>
                <li><a href="#">TCL</a></li>
                <li><a href="#">乐视</a></li>
                <li><a href="#">海信</a></li>
            </ul>
        </div>

        <div class="body clearfix">
            <div class='head'>
                <a href="#">品类</a>
                <a href="#">全部品类</a>
            </div>
            <ul>
                <li><a href="#" class='on'>全部品类</a></li>
                <li><a href="#">液晶电视</a></li>
                <li><a href="#">曲面电视</a></li>
                <li><a href="#">3D电视</a></li>
                <li><a href="#">会议/广告机</a></li>
                <li><a href="#">激光/影院电视</a></li>
            </ul>
        </div>
        <div class="body clearfix">
            <div class='head'>
                <a href="#">尺寸</a>
                <a href="#">全部尺寸</a>
            </div>
            <ul>
                <li><a href="#" class='on'>全部尺寸</a></li>
                <li><a href="#">32英寸以下</a></li>
                <li><a href="#">32英寸</a></li>
                <li><a href="#">37-39英寸</a></li>
                <li><a href="#">40-42英寸</a></li>
                <li><a href="#">43-45英寸</a></li>
            </ul>
        </div>
        <div class="body clearfix">
            <div class='head'>
                <a href="#">分辨率</a>
                <a href="#">全部分辨率</a>
            </div>
            <ul>
                <li><a href="#" class='on'>全部分辨率</a></li>
                <li><a href="#">超高清4K</a></li>
                <li><a href="#">全高清1080P</a></li>
                <li><a href="#">高清720P</a></li>
                <li><a href="#">其他</a></li>
            </ul>
        </div>
        <div class="body clearfix">
            <div class='head'>
                <a href="#">功能</a>
                <a href="#">全部功能</a>
            </div>
            <ul>
                <li><a href="#" class='on'>全部功能</a></li>
                <li><a href="#">智能网络电视</a></li>
                <li><a href="#">普通电视</a></li>
            </ul>
        </div>
        <div class="body clearfix">
            <div class='head'>
                <a href="#">3D</a>
                <a href="#">全部3D</a>
            </div>
            <ul>
                <li><a href="#" class='on'>全部3D</a></li>
                <li><a href="#">支持3D</a></li>
                <li><a href="#">不支持3D</a></li>
            </ul>
        </div>
        <div class="body clearfix">
            <div class='head'>
                <a href="#">观看距离</a>
                <a href="#">全部观看距离</a>
            </div>
            <ul>
                <li><a href="#" class='on'>全部观看距离</a></li>
                <li><a href="#">小卧室（1.7米以下）</a></li>
                <li><a href="#">小客厅/卧室（1.8~2.5米）</a></li>
                <li><a href="#">小客厅/卧室（2.6~3.0米）</a></li>
                <li><a href="#">中客厅（3.1~4.0米）</a></li>
                <li><a href="#">大客厅（4.1~5.0米）</a></li>
            </ul>
        </div>

    </div>

    <!--侧边菜单显示隐藏部分  end-->
<!--底部区域 start-->
<footer >
    <a href="#">登陆</a>
    <a href="#">注册</a>
    <a href="#">
        <span class='glyphicon glyphicon-arrow-up'></span>
        返回顶部
    </a>
</footer>

<div class="mm_end">
    <p>
        <a href="#" style="color: red;">手机APP下载</a>
        <a href="">慢慢买手机版</a>
        -- 掌上比价平台<br/> <span style="font-size: 14px">m.manmanbuy.com</span>
    </p>
</div>
<!--底部区域 end-->

<!--页面定位图片 start-->
<div class="mm_BottomBar" style="background:#eee;">
    <a class="closefix fl" href="javascript:">
        <img src="images/chacha.png">
    </a>
    <a href="#" class='fl'>
        <img src="images/logo_slow.png" alt="">
    </a>
    <div class='text'>
        <p>慢慢买</p>
        <p>全网比较，查历史价格</p>
    </div>
    <a class="download" href="#">立即打开</a>
</div>
</body>
</html>
<!--引入 jQuery 文件-->
<script src="./lib/jquery/jquery.js"></script>
<!--引入第三方类库 JS样式-->
<script src="./lib/bootstrap/js/bootstrap.min.js"></script>
<!--引入模板 文件-->
<script src="./lib/template/template.js"></script>
<!--引入自己的 JS 文件-->
<!--<script src="./js/indexSearch.js"></script>-->
<script src='./js/indexShopList.js'></script>